<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<head>
		<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1" />
		<title>Mote</title>

		<link type="text/css" href="css/jqueryui/redmond/jquery.ui.all.css" rel="Stylesheet" />
		<link type="text/css" rel="stylesheet" href="css/default.css" />
		<link type="text/css" rel="stylesheet" href="css/frmstyle.css" />
		<link type="text/css" rel="stylesheet" href="css/menu.css" />
		<link type="text/css" rel="stylesheet" href="css/displaytag.css" />

		<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
		<script type="text/javascript" src="js/jqueryui/jquery-ui-1.8.13.custom.js"></script>
		<script type="text/javascript" src="js/jqueryui/jquery.ui.widget.js"></script>
		<script type="text/javascript" src="js/jqueryui/i18n/jquery.ui.datepicker-pt-BR.js"></script>
		<script type="text/javascript" src="js/menu.js"></script>
		
	</head>
		
	</head>
	<body class="main">
		<div id="barraSup"></div>
		<div id="site">
			<div id='header'><!-- include header.html --></div>
			<div id='content'>
				<div id='menu-container'><!-- include menu.html --></div>
				<div id='content-container'>
					<h3 class='titulo-app'>Lan&ccedil;amento de Pagamento</h3><br/>

					<div id="required-field-legend">Campo obrigat&oacute;rio</div>
					<form class='frmstylizer' action="">
						<div class="FormRow">				
							<div class="Label mediumS">
								<label id="lblnome" class="FieldLabel required-field-label">Categoria</label>
							</div>
							<div class="InputField">
								<div id="divinputnome">
									<select class="DropDownInput SmallDropDown">
										<option value="" selected="selected">--Selecione--</option>
										<option value="1">Contas de Consumo</option>
										<option value="2">Transportes</option>
										<option value="3">Duplicatas</option>
									</select>
								</div>
							</div>
						</div>
						
						<div class="FormRow">				
							<div class="Label mediumS">
								<label id="lblnome" class="FieldLabel required-field-label">Item</label>
							</div>
							<div class="InputField">
								<div id="divinputnome">
									<select class="DropDownInput SmallDropDown">
										<option value="" selected="selected">--Selecione--</option>
									<option value="1">Conta de Luz</option>
									<option value="2">Conta de Telefone</option>
									<option value="3">Combust&iacute;vel</option>
									<option value="4">Seguro Autom&oacute;vel</option>
									</select>
								</div>
							</div>
						</div>
						
						<div class="FormRow">				
							<div class="Label mediumS">
								<label id="lblnome" class="FieldLabel required-field-label">Credor</label>
							</div>
							<div class="InputField">
								<div id="divinputnome">
									<select class="DropDownInput SmallDropDown">
										<option value="" selected="selected">--Selecione--</option>
									<option value="1">Light</option>
									<option value="2">OI</option>
									<option value="3">Sulam&eacute;rica</option>
									<option value="4">Outros</option>
									</select>
								</div>
							</div>
						</div>
						
						<div class="FormRow">
							<div class="Label mediumS">
								<label id="lblnome" class="FieldLabel required-field-label">Data Vencimento</label>
							</div>
							<div class="InputField">
								<div id="divinputdtini" style='float: left; '>
									<input type="text" id="strDataVencimento" name="strDataVencimento" class="dataCalend FormFieldInput small" value="" maxlength="10" readonly='readonly' />
								</div>
							</div>								
						</div>
						
						<div class="FormRow">
							<div class="Label mediumS">
								<label id="lblnome" class="FieldLabel required-field-label">Data Pagamento</label>
							</div>
							<div class="InputField">
								<div id="divinputdtini" style='float: left; '>
									<input type="text" id="strDataPagamento" name="strDataPagamento" class="dataCalend FormFieldInput small" value="" maxlength="10" readonly='readonly' />
								</div>
							</div>								
						</div>
						
						
						
						<div class="FormRow">
							<div class="Label mediumS">
								<label id="lblnome" class="FieldLabel required-field-label">Valor</label>
							</div>
							<div class="InputField">
								<div id="divinputnome">
									<input type="text" class="FormFieldInput small" id="inputnome" maxlength="50" name="inputnome"/>
								</div>
								
							</div>			
						</div>
							
						<hr/>

						<input type="submit" class="form-button form-button-blue float-left" value="Salvar" />

						<input type="submit" class="form-button form-button-red float-left" value="Cancelar" style='margin-left:10px;'/>
						
						<br/><br/>
						
						<div id="lista" class='divdisplaytag' style = "margin-top: 30px;">
							<div class="paginacao">
								<span class="pageselect" style="text-align: right;float:right;">
									<strong class="pagebox">1</strong>
									<a href="#" class="pagebox">2</a>
									<a href="#" class="pagebox">3</a> ...
									<a href="#" class="pagebox">14</a> &nbsp;
									<a href="#">Prox. &raquo;</a>
								</span>
							</div>
							<table class="displayTag" cellspacing="1" id="umLocal">
								<thead>
								<tr>
									<th></th>
									<th></th>
									<th class="sortColuna sortable sorted order1"><a href="#" style='color: rgb(255, 255, 255);'>Categoria</a></th>
									<th class="sortColuna sortable sorted order1"><a href="#" style='color: rgb(255, 255, 255);'>Item</a></th>
									<th class="sortColuna sortable sorted order1"><a href="#" style='color: rgb(255, 255, 255);'>Credor</a></th>				
									<th class="sortColuna sortable sorted order1"><a href="#" style='color: rgb(255, 255, 255);'>Valor</a></th></tr>
								</thead>
								<tbody>
								<tr class="odd">
									<td class="btColuna"><a id="28"><img alt="Editar" title="Editar" src="images/icons/btEditar.png" height="20" width="20" /></a></td>
									<td class="btColuna"><a	onclick=""><img alt="Excluir" title="Excluir" src="images/icons/btExcluir.png" height="20" width="20" /></a></td>
									<td>Conta de Consumo</td>
									<td>Conta de Luz</td>
									<td>Light</td>
									<td>R$ 123,50</td></tr>
								<tr class="even">
									<td class="btColuna"><a id="36"><img alt="Editar" title="Editar" src="images/icons/btEditar.png" height="20" width="20" /></a></td>
									<td class="btColuna"><a	onclick=""><img alt="Excluir" title="Excluir" src="images/icons/btExcluir.png" height="20" width="20" /></a></td>
									<td>Conta de Consumo</td>
									<td>Conta de Telefone</td>
									<td>OI</td>
									<td>R$ 325,00</td></tr>
								<tr class="odd">
									<td class="btColuna"><a id="32"><img alt="Editar" title="Editar" src="images/icons/btEditar.png" height="20" width="20" /></a></td>
									<td class="btColuna"><a	onclick=""><img alt="Excluir" title="Excluir" src="images/icons/btExcluir.png" height="20" width="20" /></a></td>
									<td>Transporte</td>
									<td>Combust&iacute;vel</td>
									<td>Outros</td>
									<td>R$ 100,00</td></tr>			
								<tr class="odd">
									<td class="btColuna"><a id="32"><img alt="Editar" title="Editar" src="images/icons/btEditar.png" height="20" width="20" /></a></td>
									<td class="btColuna"><a	onclick=""><img alt="Excluir" title="Excluir" src="images/icons/btExcluir.png" height="20" width="20" /></a></td>
									<td>Duplicatas</td>
									<td>Seguro Autom&oacute;vel</td>
									<td>Sulam&eacute;rica</td>
									<td>R$ 634,80</td></tr>
								</tbody>
							</table>
							<div class="paginacao">
								<span class="itensEncontrados" style='float:left;'>Mostrando todos de registros de 4 encontrados</span>
								<span class="pageselect" style="text-align: right;float:right;">
									<strong class="pagebox">1</strong>
									<a href="#" class="pagebox">2</a>
									<a href="#" class="pagebox">3</a> ...
									<a href="#" class="pagebox">14</a> &nbsp;
									<a href="#">Prox. &raquo;</a>
								</span>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
		<div id="copyright"><a href="http://apycom.com/"></a></div>
		<script>
			$(document).ready( function() {
				$('#header').load('header.html');
				$('#menu-container').load('menu.html');
				$(".dataCalend").datepicker({
					showOn: 'both',
					buttonImage: 'images/icons/date.png',
					buttonImageOnly: true,
					buttonText: 'Exibir Calend\u00E1rio'
				});
				$.datepicker.setDefaults( $.datepicker.regional[ "pt-BR" ] );
				$('#strDataVencimento').change( function() {
					$('#strDataPagamento').datepicker('option', 'minDate', $(this).datepicker('getDate'));
				});		
			} );
		</script>
	</body>
</html>
